﻿<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<link href="../../../lib/ligerUI/skins/Aqua/css/ligerui-all.css"
	rel="stylesheet" type="text/css" />
<link href="../../../lib/ligerUI/skins/Gray/css/all.css"
	rel="stylesheet" />
<script src="../../../lib/jquery/jquery-1.5.2.min.js"
	type="text/javascript"></script>
<script src="../../../lib/ligerUI/js/ligerui.all.js"></script>
<script src="../../grid/CustomersData.js" type="text/javascript"></script>
<script src="../../../lib/json2.js"></script>
</head>
<body style="padding: 10px">
	<div id="grid1"></div>
	<div id="message" style="margin: 10px;"></div>
	<script> 
        $("#grid1").ligerGrid({
            columns: [
                { name: 'CustomerID', display: '客户', width: 200, editor: { type: 'text' } },
                { name: 'CompanyName', display: '公司', width: 200, editor: { type: 'text' } },
                {
                    name: 'CustomerID', display: '客户(弹出框选择)', width: 400, align: 'left', textField: 'CustomerID'
                    , editor: {
                        type: 'popup', valueField: 'CustomerID', textField: 'CustomerID', grid: {
                            data: CustomersData, columns: [
                            { name: 'CustomerID', width: 200 }, { name: 'CompanyName', width: 200 }
                            ]
                        }, condition: {
                            fields: [
                            { name: 'CustomerID',label:'客户', width: 200 }
                            ]
                        }, onSelected: f_onSelected
                    }
                }
            ],
            data: CustomersData, enabledEdit: true
        });


        // e.value  e.text  e.data 
        function f_onSelected(e) { 
            if (!e.data || !e.data.length) return;

            var grid = liger.get("grid1");

            var selected = e.data[0]; 
            grid.updateRow(grid.lastEditRow, {
                CustomerID: selected.CustomerID,
                CompanyName: selected.CompanyName
            });

            var out = JSON.stringify(selected);
            $("#message").html('最后选择:'+out);
        }

    </script>
</body>
</html>
